<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>

<body>


    <!-- <script src="../../js/jquery.3.5.1.js"></script> -->
    <script>

        // 异步编程的结果赋值不了
        // var res = "----"
        // $.ajax({
        //     url: 'http://127.0.0.1:3002',
        //     success(data) {
        //         console.log('data--=:', data)
        //         console.log('djfeio')
        //         res = data
        //         console.log('res:', res)
        //     },
        //     error(data) {
        //         console.log('d~~~~')
        //     }
        // })
        // console.log('res-1:', res)

        // 使用Promise的简单模式
        // var p = new Promise(function(resolve, reject){
        //     // 成功时调用： resolve()
        //     // 失败时调用： reject()
        // })
        // p.then(function(ret){
        //     // 从resolve得到正常结果
        // },function(ret){
        //     // 从reject得到正常结果
        // })

        // 原生ajax的Promise方式
        function queryData1(url) {
            var p = new Promise(function (resolve, reject) {
                var xhr = new XMLHttpRequest();
                xhr.onreadystatechange = function () {
                    if (xhr.readyState != 4) return;
                    if (xhr.readyState == 4 && xhr.status >= 200) {
                        resolve(xhr.responseText);
                    } else {
                        reject("服务器错误")
                    }
                }
                xhr.open("get", url);
                xhr.send();
            })
            return p;
        };
        // var pp = queryData1("http://127.0.0.1:3002");
        // pp.then(function (data) {
        //     console.log('data~~~~~:,', data)
        // }, function (info) {
        //     console.log('info~~~~~~~~:', info)
        // })
        // console.log('~~~~~~~~~')

        //  链式调用
        // queryData1("http://127.0.0.1:3002")
        //     .then(function (data) {
        //         console.log('data1~~:', data)
        //         return queryData1("http://127.0.0.1:3002")
        //     })
        //     .then(function (data) {
        //         console.log('data2~~:', data)
        //         return queryData1("http://127.0.0.1:3002")
        //     })
        //     .then(function (data) {
        //         console.log('data3~~:', data)
        //         return queryData1("http://127.0.0.1:3002")
        //     })

        // Promise返回一个普通值
        // queryData1("http://127.0.0.1:3002")
        //     .then(function (data) {
        //         console.log('data1~~:', data)
        //         return "hello~~~~none"
        //     })
        //     .then(function (data) {
        //         console.log('data2~~:', data)
        //     })


        // 测试Promise的Api
        var p1= queryData1("http://127.0.0.1:3002/a1")
        var p2= queryData1("http://127.0.0.1:3002/a2")
        var p3= queryData1("http://127.0.0.1:3002/a3")

        // Promise.all([p1, p2, p3]).then(function(data){
        //     console.log('data@@Jjdo', data)
        // })
        Promise.race([p1, p2, p3]).then(function(data){
            console.log('data@@Jjdo', data)
        })



    </script>
</body>

</html>